<template>
  <div>
    <!-- 提交管理 -->
    <div class="title-infomation">
      <h2>提交管理</h2>
    </div>
    <!-- 功能区 -->
    <div class="table-allinfomation">
      <div id="table-info">
        <!-- 条件搜索 -->
        <div class="top-infomation">
          <el-row>
            <el-col :span="10">
              <div class="addUser">
                当前查看学期为：{{ nowSemster.semName }}
              </div>
            </el-col>
            <el-col :span="14">
              <div class="search-info">
                <!-- 查看学期 -->
                <el-select v-model="selectSemId" :placeholder="nowSemster.semName" style="margin-top:-0.8rem" @change="selectOtherSemester()">
                  <el-option
                    v-for="item in allSemesterInfo"
                    :key="item.semId"
                    :label="item.semName"
                    :value="item.semId"
                  />
                </el-select>
              </div>
            </el-col>
          </el-row>
        <!-- 搜索按钮 -->
        </div>
        <!-- 表单展示 -->
        <el-table
          v-loading="loading"
          :data="unpassAll.slice((currentPage-1)*pagesize,currentPage*pagesize)"
          stripe
          fit
          highlight-current-row
          class="table-infomation"
          :default-sort="{prop: 'sendScore', order: 'ascending'}"
        >
          <el-table-column
            label="序号"
            type="index"
            min-width="10%"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{ (currentPage - 1) * pagesize + scope.$index + 1 }}</span>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="send.sendUserId"
            label="工号"
            sortable
            :sort-orders="sortOrders"
            min-width="10%"
          />
          <el-table-column
            align="center"
            prop="actTitle"
            label="活动标题"
            sortable
            :sort-orders="sortOrders"
            min-width="10%"
          />
          <el-table-column
            align="center"
            prop="sendName"
            label="原提交位置"
            min-width="12%"
            :filters="sendAllSelectName"
            filter-multiple
            column-key="UnPass.send.sendName"
            :filter-method="selectSendName"
          />
          <el-table-column
            align="center"
            prop="actAdminName"
            label="审核人"
            sortable
            :sort-orders="sortOrders"
            min-width="10%"
          />
          <el-table-column
            align="center"
            prop="send.sendUpdateTime"
            label="审核时间"
            sortable
            :sort-orders="sortOrders"
            min-width="12%"
          />
          <el-table-column
            align="center"
            label="详情"
            min-width="10%"
            fixed="right"
          >
            <template slot-scope="scope">
              <el-button type="text" @click="showUpdateUnpass(scope.row)">更新</el-button>
              <el-button type="text" @click="showDelUnpass(scope.row)"><p style="color:#e74c3c">删除</p></el-button>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页功能 -->
        <div id="pages" class="paging-info">
          <el-pagination
            :current-page="currentPage"
            :page-sizes="[5,10,15,20,30]"
            :page-size="pagesize"
            layout="total , sizes , prev , pager , next"
            :total="unpassAll.length"
            prev-text="上一页"
            next-text="下一页"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
          />
        </div>

      </div>
    </div>
    <!-- 展示单个人的详情 -->
    <show-one-unpass-info ref="showOneUnPassInfo" />
  </div>
</template>
<script>
import { delUnPass, allUnPass } from '../../api/unpass.js'
import { getActInfo } from '../../api/act.js'
import { updateSendRouterAndScore, getSendInfo } from '../../api/send.js'
import { getSemester, getAllSemester } from '../../api/semester.js'
import { getAllInfo } from '../../api/user.js'
import { getListType } from '../../api/public.js'
import { getSlist } from '../../api/slist.js'
import showOneUnPassInfo from '../../components/showOneUnPassInfo/showOneUnPassInfo.vue'
export default {
  components: {
    'show-one-unpass-info': showOneUnPassInfo
  },
  data() {
    return {
      // 页面数据存储位置
      unpassAll: [],
      nowSemster: {},
      nowSemId: '', // 当前semId
      openSemTotal: 0, // 学期开放数量
      // 代码数据存储位置
      loading: true,
      // 全部学期信息存储位置
      allSemesterInfo: [],
      selectSemId: '', // 选择的semId
      // 类型条件选择
      sendAllSelectName: [],
      currentPage: 1, // 默认显示页面为1
      pagesize: 15, // 每页的数据条数
      sortOrders: [
        'ascending', 'descending'
      ],
      isShowSemesterInfo: false,
      sendInfoStatus: 0 // 提交状态：0未设置，1添加，2修改，3删除
    }
  },
  created() {
    // 获取学期信息
    this.getShowSemester()
    // 获取全部学期信息
    this.getAllSemesterInfo()
  },
  methods: {
    // 获取学期信息
    getShowSemester() {
      var that = this
      // 获取当前学期
      var semId = sessionStorage.getItem('semId')
      new Promise(function(resolve, reject) {
        if (semId === '无开放学期') {
        // 设置默认为第一个学期
          that.getSemesterInfo('1')
          that.nowSemId = '1'
          resolve()
        } else {
          // 保存当前学期的数据
          that.nowSemId = semId
          that.getSemesterInfo(semId)
          resolve()
        }
      }).then(() => {
        // 查看当前未通过理由为SD27001的信息（提交路由错误）
        that.showAllRouterUnpass()
      })
    },
    // 查看当前未通过理由为SD27001的信息（提交路由错误）
    showAllRouterUnpass() {
      var that = this
      var unpassAll = []
      new Promise(function(resolve, reject) {
        allUnPass().then((res) => {
          if (res.obj.length === 0) {
            that.$message({
              type: 'success',
              message: '暂无数据'
            })
            that.loading = false
            resolve()
          } else {
            for (let i = 0; i < res.obj.length; i++) {
              if (res.obj[i].unpassInfo === 'SD27001') {
              // 与活动表做连表
                const actInfo = {}
                actInfo.unpassId = res.obj[i].unpassId
                actInfo.unpassInfo = res.obj[i].unpassInfo
                // 查找act表
                getActInfo(res.obj[i].unpassActId).then((data) => {
                  actInfo.actId = data.obj.actId
                  actInfo.actTitle = data.obj.actTitle
                  // 查找send表
                  getSendInfo(data.obj.actSendId).then((send) => {
                    actInfo.send = send.obj
                    // 根据主键查userName
                    getAllInfo(send.obj.sendGiveUserId).then((user) => {
                      actInfo.actAdminName = user.obj.userinfo.userName
                      unpassAll.push(actInfo)
                    })
                  })
                })
              }
              if (i === res.obj.length - 1) {
                resolve()
              }
            }
          }
        })
      }).then(() => {
        // 获取全部党小组信息
        getListType(3).then((res) => {
          that.allRouterTypeInfo = res.obj
          const sendAllSelectName = []
          var sendAllInfo = []
          var nextArr = [false, false]
          for (let i = 0; i < res.obj.slist.length; i++) {
            const sendSelectName = {
              text: res.obj.slist[i].slistName,
              value: res.obj.slist[i].slistName
            }
            const arr = {
              key: res.obj.slist[i].slistName,
              value: {
                sendFlistId: res.obj.slist[i].slistFlistId,
                sendSlistId: res.obj.slist[i].slistId,
                sendTlistId: 'nolook'
              }
            }
            sendAllSelectName.push(sendSelectName)
            sendAllInfo.push(arr)
            if (i === res.obj.slist.length - 1) {
              nextArr[0] = true
            }
          }
          if (nextArr[0] === true) {
            for (let i = 0; i < res.obj.tlist.length; i++) {
              getSlist(res.obj.tlist[i].tlistSlistId).then((data) => {
                const sendSelectName = {
                  text: res.obj.tlist[i].tlistName,
                  value: res.obj.tlist[i].tlistName
                }
                const arr = {
                  key: res.obj.tlist[i].tlistName,
                  value: {
                    sendFlistId: data.obj.slistFlistId,
                    sendSlistId: res.obj.tlist[i].tlistSlistId,
                    sendTlistId: res.obj.tlist[i].tlistId
                  }
                }
                sendAllSelectName.push(sendSelectName)
                sendAllInfo.push(arr)
                if (i === res.obj.tlist.length - 1) {
                  nextArr[1] = true
                  // 存储路由信息
                  that.sendAllSelectName = sendAllSelectName
                  that.sendAllInfo = sendAllInfo
                }
              })
            }
          }
        })
        setTimeout((sendAllInfo) => {
          if (unpassAll.length === 0) {
            that.$message({
              type: 'success',
              message: '暂无数据'
            })
          }
          for (let i = 0; i < unpassAll.length; i++) {
            for (let j = 0; j < that.sendAllInfo.length; j++) {
              if (unpassAll[i].send.sendFlistId === that.sendAllInfo[j].value.sendFlistId && unpassAll[i].send.sendSlistId === that.sendAllInfo[j].value.sendSlistId && unpassAll[i].send.sendTlistId === that.sendAllInfo[j].value.sendTlistId) {
                unpassAll[i].sendName = that.sendAllInfo[j].key
                break
              }
            }
          }
          that.unpassAll = unpassAll
          that.loading = false
        }, 500)
      })
    },
    // 展示删除信息
    showDelUnpass(unPassInfo) {
      var that = this
      that.$confirm('是否确定删除', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // 修改send表状态（审核中，分数为null）
        that.updateSendStatusAndScore(unPassInfo)
      }).catch(() => {})
    },
    // 更新不通过信息
    showUpdateUnpass(unPassInfo) {
      var that = this
      // 父子组件之间的传值 将unPassInfo中的数据 发送到子组件（showOneUnPassInfo）中
      that.$refs.showOneUnPassInfo.showDialog(unPassInfo, that.sendAllSelectName, that.sendAllInfo)
    },
    // 修改send表状态（审核中，分数为null）
    updateSendStatusAndScore(unPassInfo) {
      var that = this
      var sendId = unPassInfo.UnPass.unpassSendId
      var sendStatus = 0
      var sendGiveUserId = sessionStorage.getItem('userId')
      updateSendRouterAndScore(sendId, sendStatus, sendGiveUserId).then((res) => {
        // 删除unpass表信息
        that.delUnPass(unPassInfo.UnPass.unpassId)
      }).catch(() => {
        that.$message({
          type: 'warning',
          message: '服务器繁忙，请稍后再试'
        })
        setTimeout(() => {
          top.location.reload()
        }, 200)
      })
    },
    // 删除不通过数据
    delUnPass(unpassId) {
      var that = this
      delUnPass(unpassId).then((res) => {
        if (res.msg !== '操作成功') {
          that.$message({
            type: 'warning',
            message: '服务器繁忙，请稍后再试'
          })
        } else {
          that.$message({
            type: 'success',
            message: '修改位置成功'
          })
        }
        setTimeout(() => {
          top.location.reload()
        }, 200)
      }).catch(() => {
        that.$message({
          type: 'warning',
          message: '服务器繁忙，请稍后再试'
        })
        setTimeout(() => {
          top.location.reload()
        }, 200)
      })
    },
    // 页面逻辑方法

    // 获取学期信息
    getSemesterInfo(semId) {
      var that = this
      getSemester(semId).then((res) => {
        that.nowSemster = res.obj
      })
    },
    // 获取全部学期的方法
    getAllSemesterInfo() {
      var that = this
      getAllSemester().then((res) => {
        that.allSemesterInfo = res.obj
      })
    },
    // 选择其他学期
    selectOtherSemester() {
      this.nowSemId = this.selectSemId
      this.showAllRouterUnpass()
    },
    // 选择提交位置
    selectSendName(value, row, column) {
      return row.sendName === value
    },
    // 分页信息
    handleSizeChange(size) {
      this.pagesize = size
    },
    // 点击第几页
    handleCurrentChange(currentPage) {
      this.currentPage = currentPage
    },
    handleClick(row) {
    },

    // 刷新页面，原理先关闭再打开
    reload() {
      this.isRouterAlive = false // 先关闭，
      this.$nextTick(function() {
        this.isRouterAlive = true // 再打开
      })
    }

  }
}
</script>
<style lang="scss">
#main{
  margin-left: 5px;
  margin-right: 5px;
  margin-bottom: 10rem;
}
#table-area{
  margin-left: 0.8rem;
  margin-right: 0.8rem;
}
.title-infomation{
  margin-top:3rem;
  margin-left: 4rem;
}
.table-info{
  margin-left: 7rem;
  margin-right: 10rem;
}
.table-infomation{
  width: 100rem;
}
.paging-info{
    margin-top: 2rem;
}
.reset-userType{
    margin-top: 2rem;
}
.search-info{
    display: flex;
  margin-top:3rem;
  justify-content: flex-end;
  margin-bottom: 1.5rem;
  margin-right: 3rem;
}
.addUser{
  margin-top:3rem;
  margin-bottom: 1.5rem;
}
.table-allinfomation{
  margin-left: 7rem;
  margin-right: 5rem;
}
.el-top-all-button{
    margin-left: 1rem;
}
</style>
